<template>
	<!-- 检验结果 -->
	<view class="mt-24rpx mr-32rpx ml-32rpx">
		<u-table>
			<u-tr class="u-tr">
				<u-th class="u-th">
					<view class="flex-wrap-left w-299rpx ml-18rpx">
						检查项目
					</view>
				</u-th>
				<u-th class="u-th">
					<view class="flex-wrap-right w-299rpx mr-18rpx">
						检验结果
					</view>
				</u-th>
			</u-tr>
			<u-tr class="u-tr" v-for="(item, index) in inspectionResultsList" :key="index">
				<u-td class="u-td">
					<view class="tabListText flex-wrap-left w-299rpx ml-18rpx"
						:class="{'disqualificationColor':!item.checkItemResult && item.checkItemText === ''}">
						{{ item.checkItemName }}
					</view>
				</u-td>
				<u-td class="u-td" v-if="!item.flag">
					<view class="tabListText flex-wrap-right w-299rpx mr-18rpx">
						{{item.checkItemText}}
					</view>
				</u-td>
				<u-td class="u-td" v-else-if="item.flag && item.checkItemResult">
					<view class="tabListText flex-wrap-right w-299rpx mr-18rpx">
						OK
					</view>
				</u-td>
				<u-td class="u-td" v-else>
					<view class="tabListText flex-wrap-right w-299rpx mr-18rpx disqualificationColor">
						NO
					</view>
				</u-td>
			</u-tr>
		</u-table>
		<view class="w-100% h-40rpx"></view>
	</view>
</template>

<script setup lang="ts">
	import { defineProps, toRefs } from 'vue'
	const props = defineProps<{
		inspectionResultsList ?: {}[];
	}>()
	const inspectionResultsList = toRefs(props).inspectionResultsList
</script>

<style scoped>
	.u-td {
		height: 96rpx;
	}

	.u-th {
		height: 80rpx;
		font-size: 26rpx;
		font-family: PingFangSC-Medium, PingFang SC;
		font-weight: 500;
		color: #1E1F22;
	}

	.tabListText {
		font-size: 26rpx;
		font-family: PingFangSC-Regular, PingFang SC;
		font-weight: 400;
		color: #4B4D55;
	}

	.disqualificationColor {
		color: #E52B2B;
	}
</style>